<template>
	<view class="">
		<u-navbar title="学分明细"></u-navbar>
		<!-- 列表 -->
		<view v-if="!dataList || !dataList.length" class="empty">
			暂无数据
		</view>
		<view v-else v-for="(item,index) in dataList" :key="index" 
			class="u-flex card-box u-row-between">
			<text class="u-flex card-box-title">完成课程：{{item.lessonName}}</text>
			<text class="u-flex card-box-score"> +{{item.studyScore || 0}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		components: {
		},
		data(){
			return{
				dataList:[
					// {
					// 	"lessonName": "测试调和田中芳树在测试调和田中加霸",
					// 	"studyHour": 10,
					// 	"studyScore": 10
					// }
				]
			}
		},
		onLoad() {
			this.initData()
			//var player = new prismplayer({id:"J_prismPlayer",autoplay:false,width:"100%",vid:"${vid}",playauth:"${playAuth}",});
			
		},
		methods:{
			initData(){
				this.$util.request('app/classroom/v1/getMyStudyScoreInfo','get',{},false).then(res=>{
					this.dataList = res.data
				})
			}
		}
	}
</script>

<style>
	page{
		background: #FFFFFF;
	}
	.top-box {
		background: #FFFFFF;
		position: sticky;
		top: calc(44px + var(--status-bar-height));
		left: 0;
		right: 0;
		z-index: 999;
	}
	
	.card-box{
		padding: 30rpx;
		background: #FFFFFF;
		border-radius: 16rpx;
		margin-bottom: 24rpx;
		border-bottom: 1px solid #E8E8E8;
		color: #8C8C8C;
	}		
	
	.card-box-title{
		font-size: 28rpx;
		line-height: 40rpx;
		flex: 1;
		/* color: $default-font-color; */
	}
	.card-box-score{
		color: #F53939;
	}
	.empty{
		margin: 40rpx;
		color: #BFBFBF;
		text-align: center;
		font-size: 28rpx;
	}
</style>
